<template>
  <div class="register">

      <div class="register-system">
          <h1>Node.Js论坛系统</h1>        
        </div>
      <div class="register-title">
          <div class="line"></div>
          <h2>注册</h2>
          <div class="line"></div>
      </div>

    <div class="forms">
        <el-form :label-position="labelPosition" :rules="rules" ref="formLabelAlign" label-width="100px" :model="formLabelAlign">
        <el-form-item label="用户名" prop="username">
            <el-input v-model="formLabelAlign.username" placeholder="请输入用户名"></el-input>
        </el-form-item>
        <el-form-item label="密码" prop="password">
            <el-input v-model="formLabelAlign.password" placeholder="请输入密码" type="password"></el-input>
        </el-form-item>
        <el-form-item label="重复密码" prop="passwordagain">
            <el-input v-model="formLabelAlign.passwordagain" placeholder="再次输入密码" type="password"></el-input>
        </el-form-item>
        <el-form-item label="邮箱" prop="email">
            <el-input @keyup.enter.native="submit('formLabelAlign')" v-model="formLabelAlign.email" placeholder="请输入邮箱"></el-input>
        </el-form-item>
    </el-form>
    </div>

    <div class="submit">
         <el-button type="primary" @click="submit('formLabelAlign')">点击注册</el-button>
         <el-button type="success" @click="goLogin">已有账号？返回登录</el-button>
    </div>
    
  </div>
</template>
<script>
import register from './register';
export default register

</script>
<style lang="less" scoped>
    .register {
        height: 100%;
        width: 100%;
        text-align: center;
        padding-top: 50px;
        box-sizing: border-box;
        .register-title {
            display: flex;
            padding: 0 30px 50px 30px;
            h2 {
                color: #20a0ff;
                padding: 0 50px;
            }
            .line {
                flex: 1;
                position: relative;
                padding: 0 90px;
                top: 34px;
                height: 2px;
                background-color: rgba(0,0,0,.1);
            }
        }
    }
    .forms {
        width: 30%;
        margin: 0 auto;
    }
    .submit {
        margin-top: 20px;
    }
</style>